<template>
  <view class="order-page">
    <uni-segmented-control 
      :current="currentTab" 
      :values="['全部', '进行中', '待付款']"
      @clickItem="switchTab"
    />

    <scroll-view scroll-y class="order-list">
      <view 
        v-for="order in filteredOrders"
        :key="order.id"
        class="order-card"
      >
        <view class="header">
          <text class="parking">{{ order.parking }}</text>
          <text :class="['status', order.status]">{{ order.statusText }}</text>
        </view>
        <view class="body">
          <view class="info-item">
            <uni-icons type="car" size="16"/>
            <text>{{ order.plate }}</text>
          </view>
          <view class="info-item">
            <uni-icons type="clock" size="16"/>
            <text>{{ order.duration }}小时</text>
          </view>
        </view>
        <view class="footer">
          <text class="amount">¥{{ order.amount }}</text>
          <button v-if="order.status === 0" class="pay-btn">立即支付</button>
        </view>
      </view>
    </scroll-view>
  </view>
</template>